<header class="main-header">
 <!-- Logo -->
 <a href="/index.html" class="logo">
   <!-- mini logo for sidebar mini 50x50 pixels -->
   <span class="logo-mini"><b>K</b>GA</span>
   <!-- logo for regular state and mobile devices -->
   <span class="logo-lg"><b>Kangaroo</b>Admin</span>
 </a>

 <!-- Header Navbar -->
 <nav class="navbar navbar-static-top" role="navigation">
   <!-- Sidebar toggle button-->
   <a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
     <span class="sr-only">Toggle navigation</span>
   </a>
   <!-- Navbar Right Menu -->
   <div class="navbar-custom-menu">
     <ul class="nav navbar-nav">
       <!-- Messages: style can be found in dropdown.less-->
       <li class="dropdown messages-menu">
         <!-- Menu toggle button -->
         <a href="#" class="dropdown-toggle" data-toggle="dropdown">
           <i class="fa fa-envelope-o"></i>
           <span class="label label-success">4</span>
         </a>
         <ul class="dropdown-menu">
           <li class="header">您有4封未读邮件</li>
           <li>
             <!-- inner menu: contains the messages -->
             <ul class="menu">
               <li><!-- start message -->
                 <a href="#">
                   <div class="pull-left">
                     <!-- User Image -->
                     <img src="/dist/img/user2-160x160.jpg" class="img-circle" alt="User Image">
                   </div>
                   <!-- Message title and timestamp -->
                   <h4>
                     Support Team
                     <small><i class="fa fa-clock-o"></i> 5 mins</small>
                   </h4>
                   <!-- The message -->
                   <p>Why not buy a new awesome theme?</p>
                 </a>
               </li><!-- end message -->
             </ul><!-- /.menu -->
           </li>
           <li class="footer"><a href="#">See All Messages</a></li>
         </ul>
       </li><!-- /.messages-menu -->

       <!-- Notifications Menu -->
       <li class="dropdown notifications-menu">
         <!-- Menu toggle button -->
         <a href="#" class="dropdown-toggle" data-toggle="dropdown">
           <i class="fa fa-bell-o"></i>
           <span class="label label-warning">10</span>
         </a>
         <ul class="dropdown-menu">
           <li class="header">您有10条消息</li>
           <li>
             <!-- Inner Menu: contains the notifications -->
             <ul class="menu">
               <li><!-- start notification -->
                 <a href="#">
                   <i class="fa fa-users text-aqua"></i> 5 new members joined today
                 </a>
               </li><!-- end notification -->
             </ul>
           </li>
           <li class="footer"><a href="#">View all</a></li>
         </ul>
       </li>
       <!-- User Account Menu -->
       <li class="dropdown user user-menu">
         <!-- Menu Toggle Button -->
         <a href="#" class="dropdown-toggle" data-toggle="tooltip" title="Admnin" data-placement="bottom">
           <img src="/dist/img/user2-160x160.jpg" class="user-image" alt="User Image">
           <span class="hidden-xs">${(token.data)!'游客'}</span>
         </a>
       </li>
       <li>
         <a href="/login/logout.html" class="dropdown-toggle" data-toggle="tooltip" title="退出" data-placement="bottom">
           <i class="fa fa-sign-out"></i>
         </a>
       </li>
       <!-- Control Sidebar Toggle Button -->
        <li>
          <a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
        </li>
      </ul>
    </div>
  </nav>
</header>